
<template>
  <div class="chart-container" ref="chart"></div>
</template>

<script>
import * as echarts from 'echarts';
export default {
  mounted() {
    this.initChart();
    window.addEventListener('resize', this.resizeChart);
  },
  beforeDestroy() {
    window.removeEventListener('resize', this.resizeChart);
    this.chart && this.chart.dispose();
  },
  methods: {
    initChart() {
      this.chart = echarts.init(this.$refs.chart);
      this.chart.setOption({
        // 你的图表配置
      });
    },
    resizeChart() {
      this.chart && this.chart.resize();
    }
  }
}
</script>

<style scoped>
.chart-container {
  width: 100%;
  height: 100%;
  min-height: 300px;
  /* 防止高度塌陷 */
}
</style>
